<div class="wrapper-md">
  <div class="row">

    <div class="panel panel-default">
      <tabset class="tab-container" >

        <tab heading="菜单列表" ng-click="cancel()" active="status.active">
          <div class="panel-body">
            <table id ="treetable" class="table table-striped table-bordered table-condensed tree_table" style="display: none;">
              <thead>
                <tr>
                  <th style="width: 130px;text-align:center;">名称</th>
                  <th style="width: 120px;text-align:center;">链接</th>
                  <th style="width: 30px;text-align:center;">排序</th>
                  <th style="width: 30px;text-align:center;">可见</th>
                  <th style="width: 100px;text-align:center;">权限标识</th>
                  <th style="width: 80px;text-align:center;">操作</th>
                </tr>
              </thead>
              <tbody>
                <tr ng-repeat="menu in dataForTheTree" id="{{menu.id}}" pid="{{menu.parent.id != '1'? menu.parent.id : '0'}}" sort={{menu.sort}} menuloadover>
                  <td style="padding: 8px 0px">
                    <i class="icon-{{menu.icon}}"></i>
                    <a href ng-click="update(menu)" style="color:#2fa4e7">{{menu.name}}</a>
                  </td>
                  <td style="padding: 8px 5px">
                    <div style="width: 160px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;" 
                    popover-placement="bottom" popover="{{menu.href}}" popover-trigger="mouseenter">
                      {{menu.href}}
                    </div>
                  </td>
                  <td align="center">{{menu.sort}}</td>
                  <td align="center">{{menu.isShow == '1'?"显示":"隐藏"}}</td>
                  <td style="padding: 8px 5px">
                    <div style="width: 100px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;">
                      {{menu.permission}}
                    </div>
                  </td>
                  <td style="padding: 8px 5px" align="center">
                    <button type="button" class="btn btn-info btn-xs" ng-click="add(menu)">添加下级</button>
                    <button type="button" class="btn btn-info btn-xs" ng-click="update(menu)">修改</button>
                    <button type="button" class="btn btn-danger btn-xs" ng-click="delete(menu,$index)">删除</button>
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
        </tab>
        
        <tab heading={{tabname.name}} ng-click="add(1)" active="tabname.active">
          <div class="panel-body">
            <form name="form1" class="form-horizontal form-validation ng-pristine ng-valid ng-valid-required">
              <div class="form-group">
                <label class="col-lg-2 control-label">上级菜单:</label>
                <div class="col-lg-4">
                  <ui-select ng-model="obj.parent_id" theme="bootstrap" ng-change="getPid($select.selected)">
                    <ui-select-match placeholder="选择上级菜单..">{{$select.selected.name}}</ui-select-match>
                    <ui-select-choices repeat="item.id as item in menu_list | filter: {'name' : $select.search}">
                      <span ng-bind-html="item.name | highlight: $select.search"></span>
                    </ui-select-choices>
                  </ui-select>
                </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 control-label">名称:</label>
                <div class="col-lg-4">
                  <input type="text" class="form-control" placeholder="必填" ng-model="obj.name">
                </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 control-label">链接:</label>
                <div class="col-lg-4">
                  <input type="text" class="form-control" ng-model="obj.href">
                </div>
                <label class="control-label text-muted">点击菜单跳转的页面</label>
              </div>
              <div class="form-group">
                <label class="col-lg-2 control-label">目标:</label>
                <div class="col-lg-3">
                  <input type="text" class="form-control" ng-model="obj.target">
                </div>
                <label class="control-label text-muted">链接地址打开的目标窗口，默认：mainFrame</label>
              </div>
              <div class="form-group">
                <label class="col-lg-2 control-label">菜单标识:</label>
                <div class="col-lg-3">
                  <input type="text" class="form-control" ng-model="obj.menu_permission">
                </div>
                <label class="control-label text-muted">菜单标识,不可重复,可作为菜单查询接口的标记</label>
              </div>
              <div class="form-group">
                <label class="col-lg-2 control-label">图标:</label>
                <div class="col-lg-2">
                  <input type="text" class="form-control" ng-model="obj.icon">
                </div>
                <div class="col-lg-2">
                  <button type="button" class="btn btn-primary" ng-click="setIcon()">添加图标</button>
                </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 control-label">排序:</label>
                <div class="col-lg-2">
                  <input type="number" class="form-control" ng-model="obj.sort">
                </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 control-label">可见:</label>
                <div class="col-lg-8">
                  <div class="radio">
                    <label class="i-checks">
                      <input type="radio" ng-model="obj.is_show" value="1"><i></i>显示
                    </label>
                    <label class="i-checks" style="margin-left: 10px">
                      <input type="radio" ng-model="obj.is_show" value="0"><i></i>隐藏
                    </label>
                  </div>
                </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 control-label">权限标识:</label>
                <div class="col-lg-2">
                  <button type="button" class="btn btn-primary" ng-click="setInterface()">添加</button>
                </div>
              </div>
              <div class="form-group">
                <div class="col-lg-2"></div>
                <div class="col-lg-10">
                  <div style="padding-right: 20px; padding-bottom: 5px; float: left;"  ng-repeat="info in iface">
                    <button class="btn btn-sm btn-info">{{info.name+info.id}}
                      <i class="glyphicon glyphicon-remove" ng-click="remove($index)"></i>
                    </button>
                  </div>
                </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 control-label">备注:</label>
                <div class="col-lg-4">
                  <textarea id="remarks" class="form-control" rows="3" ng-model="obj.remarks"></textarea>
                </div>
              </div>
            </form>

            <div class="col-lg-2"></div>
            <div class="col-lg-3">
              <button class="btn btn-primary btn-rounded" ng-click="save()">保存</button>
              <button class="btn btn-default btn-rounded" ng-click="cancel()">取消</button>
            </div>
          </div>
        </tab>



      </tabset>
    </div>

  </div>
</div>


